<template>
  <iframe id="searchIfr"></iframe>
</template>

<script>

  import {mapActions} from "vuex"
  import {Observer} from "../../core/util";
  import eRes from '../../../core/editorRes';
  export default {
    data() {
      return {
        cs: null, // cnkisearch的实例
      };
    },
    computed: {

    },
    props: {
      courseCode: {
        type: String,
        default: ""
      },
      catalogCode: {
        type: String,
        default: ""
      },
      isAddBtn: {
        type: Boolean,
        default: true
      },
      containerHeight: {
        type: Number
      }
    },
    methods: {
      ...mapActions(['addStatistics']),
      init(){
        let cs = new CnkiSearch({
          id: "searchIfr",
          url: globalVar['url_search_proj'],
          token: window.tokenFromUrl,
          userID: window.uidFromUrl,
          isAddBtn: true,
          isFullScreenBtn: true,
          addBtnName: '添加到课程',
          fullHeight: this.containerHeight,
          apiurl: "coeduApi"
        });
        // 添加到课程
        cs.on("add-to-course", this.addToCourse);
        // 添加参考文献
        cs.on("add-ref", this.addRef);
        // 添加统计
        cs.on("add-stat", this.addStat);
        // 全屏阅读
        cs.on("read-full-screen", this.readFullScreen)
        this.cs = cs;
      },
      addRef(data){
        Observer.fire("insertHtml", {
          html: data.text,
          quote: data.referenceInfo,
          // info: "bbb"
        });
      },
      addStat(data){
        this.addStatistics(data.optType);
      },
      readFullScreen({lib, raw, src, title, type}){
        let that = this;
        const layer = layui.layer;
        let w = $(window).width();
        let h = $(window).height();
        switch (type) {
          case "iframe":
            layer.open({
              type: 2,
              title,
              shade: false,
              maxmin: true, //开启最大化最小化按钮
              area: ['1000px', 0.9 * h + 'px'],
              content: src
            });
            break;
          case "video":
            layer.open({
              type: 1,
              title,
              shade: false,
              maxmin: true, //开启最大化最小化按钮
              area: ['1000px', 0.9 * h + 'px'],
              content: '<video controls="controls" class="video-center" src="'+src+'" autoplay="autoplay"></video>'
            });
            break;
          default:
            this.globalShowMsg({msg: "unknown type"});
        }
      },
      addToCourse({lib, ...others}){
        console.log(lib);
        console.log(others);
        let editor = UE.getEditor(window.editorId);
        switch (lib) {
          case "Literature":
          case "CFED":
            // 文献库
            eRes.addResource({
              type: 'stdIframe',
              name: others.title,
              ifrSrc: others.src,
              iconType: 'cnki_literature',
              nameLink: others.raw.Uri
            });
            break;
          case "CFED1":
            // 知好乐库
            let type = others.type;
            if (type === "video") {
              eRes.addResource({
                type: 'nativevideo',
                name: others.title,
                src: others.src,
                iconType: 'cnki_video'
              });
            } else if (type === "iframe") {
              eRes.addResource({
                type: 'stdIframe',
                name: others.title,
                ifrSrc: others.src,
                iconType: 'cnki_flash'
              });
            } else if (type === "audio") {
              eRes.addResource({
                type: 'nativeaudio',
                name: others.title,
                src: others.src,
                iconType: 'cnki_audio'
              });
            } else if (type === "image") {
              editor.execCommand("insertmedia", {
                src: others.src,
                describe: others.title,
                type: 'image'
              });
            } else if (type === "link") {
              editor.execCommand('insertfile', {
                title: others.title,
                url: others.src,
                ext: others.fileType
              });
            }
            break;
          case "CRFD":
            let link = `<a href="${others.src}" style='color:#0066cc;' target='_blank'>${others.title}</a><br/>`;
            Observer.fire("insertHtml", link);
            break;
          case "Picture":
            editor.execCommand("insertmedia", {
              src: others.src,
              describe: others.title,
              type: 'image'
            });
            break;
          default:
            this.globalShowMsg({msg: "unknown lib"});
        }

      },
    },
    watch: {
      containerHeight(newVal, oldVal){
        if(this.cs){
          this.cs.fire("set-fullHeight", newVal);
        }
      }
    },
    mounted() {
      this.init();
    }
  };
</script>
<style>
  .video-center {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
  }
</style>
